
import React from "react";
import { Space } from "antd";
import Controller from "Controller";
import Light from "./Light";
import SpotLight from "./SpotLight";
import Mesh from "./Mesh";
import Object3D from "./Object3D";

export default function Properties() {

    const threeController = Controller.instance.useMemo(s => s.threeController, []);

    const selectedElementUuid = threeController.useMemo(s => s.selectedElementUuid, []);

    const elementMap = threeController.useMemo(s => s.elementMap, []);

    const element = React.useMemo(() => selectedElementUuid ? elementMap.get(selectedElementUuid) : undefined, [elementMap, selectedElementUuid]);

    return (
        <Space direction="vertical" style={{ width: '100%' }}>
            {element?.object3D.isObject3D && <Object3D />}{/* 灯光基础 */}
            {element?.object3D.isLight && <Light />}{/* 灯光基础 */}
            {element?.object3D.isSpotLight && <SpotLight />}{/* 聚光灯 */}
            {element?.object3D.isMesh && <Mesh />}{/* 图形 */}
        </Space>
    )
}